<template>
    <div class="app-container">
      <el-form :model="queryParams" ref="queryForm" :inline="true" label-width="68px">

        <el-form-item label="学期" prop="className">
          <el-select
            v-model="queryParams.tetiId"
            @change="getTetiDate"
            clearable
            filterable
            size="small"
            style="width: 180px">
            <el-option
              v-for="dict in termTimeList"
              :key="dict.id"
              :label="dict.tetiBeginYear+'~'+dict.tetiEndYear"
              :value="dict.id"
            >
            <span style="float: left">{{ dict.tetiBeginYear+'~'+dict.tetiEndYear }}</span>
            <span style="float: right; color: #8492a6; font-size: 13px">{{ dict.tetiTerm==1?'一学期':'二学期' }}</span>
            </el-option>
          </el-select>

        </el-form-item>
        <el-form-item label="科目" >
          <el-select
            v-model="queryParams.subjId"
            clearable
            filterable
            size="small"
            style="width: 180px">
            <el-option
              v-for="dict in subjectList"
              :key="dict.id"
              :label="dict.subjName"
              :value="dict.id"
            />
          </el-select>
        </el-form-item>

        <el-form-item label="老师" prop="classDept">
          <el-select
            v-model="queryParams.syusId"
            clearable
            filterable
            size="small"
            style="width: 180px">
            <el-option
              v-for="dict in userOptions"
              :key="dict.id"
              :label="dict.username"
              :value="dict.id"
            />
          </el-select>
        </el-form-item>
        <el-form-item label="班级名称" prop="classDept">
          <el-select
            v-model="queryParams.scclId"
            clearable
            filterable
            size="small"
            style="width: 180px">
            <el-option
              v-for="dict in classList"
              :key="dict.id"
              :label="dict.className"
              :value="dict.id"
            />
          </el-select>
        </el-form-item>


        <el-form-item>
          <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
          <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
        </el-form-item>
      </el-form>


      <el-tabs v-model="activeName" @tab-click="handleClick">
      <el-tab-pane label="排课计划" name="first">
        <el-row :gutter="10" class="mb8">
        <el-col :span="1.5">
          <el-button v-hasPermi="['class:info:edit']"
            type="primary"
            icon="el-icon-plus"
            size="mini"
            @click="handleAdd"
            >新增排课计划</el-button>
        </el-col>
      </el-row>
        <el-table v-loading="loading" :data="coursePlanList" >
        <!-- <el-table-column type="selection" width="55" align="center" /> -->
        <el-table-column label="学期" align="center" prop="tetiId" width="170">
          <template slot-scope="scope">
              {{getTermTimeName(scope.row.tetiId)}}
          </template>
        </el-table-column>
        <el-table-column label="科目" align="center" prop="subjId" :show-overflow-tooltip="true" >
          <template slot-scope="scope">
              {{getSubjectName(scope.row.subjId)}}
          </template>
        </el-table-column>
        <el-table-column label="班级" align="center" prop="scclId" :show-overflow-tooltip="true" >
          <template slot-scope="scope">
              {{getClassName(scope.row.scclId)}}
          </template>
        </el-table-column>
        <el-table-column label="老师" align="center" prop="syusId">
          <template slot-scope="scope">
            {{ getTeacherName(scope.row.syusId) }}
          </template>
        </el-table-column>
        <el-table-column label="教室" align="center" prop="bsloId" :show-overflow-tooltip="true" >
          <template slot-scope="scope">
              {{getLocationName(scope.row.bsloId)}}
          </template>
        </el-table-column>
        <el-table-column label="排课节次" align="center" prop="coseId" width="160"  >
          <template slot-scope="scope">
              {{getCoseName(scope.row.coseId)}}
          </template>
        </el-table-column>
        <el-table-column label="课程开始周" align="center" prop="coplBeginWeekNo" width="130" :show-overflow-tooltip="true" />
        <el-table-column label="课程结束周" align="center" prop="coplEndWeekNo" width="130">
        </el-table-column>
        <el-table-column label="单双周" align="center" prop="coplIsDuboleWeek" width="60">
          <template slot-scope="scope">
            {{ scope.row.coplIsDuboleWeek=='d'?'单周':'双周' }}
          </template>
        </el-table-column>
        <el-table-column label="创建时间" align="center" prop="createTime" width="150">
          <template slot-scope="scope">
            {{parseTime(scope.row.createTime)}}
          </template>
        </el-table-column>
        <el-table-column label="课程生成状态" align="center" width="120" prop="coplCourseGennerStatus">
          <template slot-scope="scope">
            <el-tag v-if="scope.row.coplCourseGennerStatus==0">未生成</el-tag>
            <el-tag v-if="scope.row.coplCourseGennerStatus==1">生成中</el-tag>
            <el-tag v-if="scope.row.coplCourseGennerStatus==2">部分生成</el-tag>
            <el-tag v-if="scope.row.coplCourseGennerStatus==3">全部生成</el-tag>
          </template>
        </el-table-column>
        <el-table-column label="操作" align="center" width="150" >
          <template slot-scope="scope">
            <el-tooltip class="item" effect="dark" content="查看"  placement="top">
              <el-button size="mini" circle type="success" icon="el-icon-edit" @click="handleUpdate(scope.row)" />
            </el-tooltip>
            <el-tooltip class="item" effect="dark" content="删除" placement="top">
              <el-button size="mini" circle type="danger" icon="el-icon-delete"  @click="handleDelete(scope.row)" />
            </el-tooltip>
            <!-- <el-tooltip class="item" effect="dark" content="查看课表" placement="top">
              <el-button size="mini" circle  icon="el-icon-s-grid"  @click="openTeacherClassTime(scope.row)" />
            </el-tooltip> -->

          </template>
        </el-table-column>
      </el-table>

      <pagination
        v-show="total>0"
        :total="total"
        :page.sync="queryParams.pageNum"
        :limit.sync="queryParams.pageSize"
        @pagination="getClassList"
      />

      </el-tab-pane>
      <el-tab-pane label="班级课表" name="second">
        <div v-loading="!showTabS" style="min-height:500px;width:100%" element-loading-text="正在加载中">
          <cla-time-calendar v-if="showTabS" ref="claTimeCalendar" :readonly="false"
          :claId="queryParams.scclId+''"
          :teacherId="queryParams.syusId+''"
          :tetiId="queryParams.tetiId+''"
          :claName="getClassName(queryParams.scclId)"
          :tetiBeginDate="tetiBeginDate"
          :tetiEndDate="tetiEndDate"
          :subjectList="subjectList"
          :userOptions="userOptions"
          :coseList = "coseList"
          :classRoomList="classRoomList"
          can-cla-time-attend class="calendar" />
        </div>

      </el-tab-pane>
    </el-tabs>


      <!-- 添加或修改参数配置对话框 -->
    <el-dialog :title="title" :visible.sync="open" width="50%" >
      <el-form ref="form" :model="form" :rules="rules" label-width="120px" >
        <el-form-item label="学期" prop="tetiId">
          <el-select
            v-model="form.tetiId"
            clearable
            filterable
            size="small"
            @change="getAemesterWeekNum"
            style="width: 100%">
            <el-option
              v-for="dict in termTimeList"
              :key="dict.id"
              :label="dict.tetiBeginYear+'~'+dict.tetiEndYear"
              :value="dict.id"
            >
            <span style="float: left">{{ dict.tetiBeginYear+'~'+dict.tetiEndYear }}</span>
            <span style="float: right; color: #8492a6; font-size: 13px">{{ dict.tetiTerm==1?'一学期':'二学期' }}
              ({{ parseTime(dict.tetiTermBeginDate,'{y}-{m}-{d}') }} ~ {{ parseTime(dict.tetiTermEndDate,'{y}-{m}-{d}') }})</span>
            </el-option>
          </el-select>
        </el-form-item>
        <el-row>
          <el-col :span="12">
            <el-form-item label="科目" prop="subjId">
              <el-select
                v-model="form.subjId"
                clearable
                filterable
                size="small"
                style="width: 100%">
                <el-option
                  v-for="dict in subjectList"
                  :key="dict.id"
                  :label="dict.subjName"
                  :value="dict.id"
                />
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="班级" prop="scclId">
              <el-select v-model="form.scclId" clearable filterable style="width:100%">
                <el-option v-for="item in classList" :label="item.className" placeholder="班级" :value="item.id" :key="item.id">
                  <span style="float: left">{{ item.className }}</span>
                  <span style="float: right; color: #8492a6; font-size: 13px">{{ item.classTeacherId }}</span>
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-form-item label="任课老师" prop="syusId">
           <el-select v-model="form.syusId" filterable placeholder="请选择" style="width:100%">
             <el-option
                     v-for="item1 in userOptions"
                     :key="item1.id"
                     :label="item1.username"
                     :value="item1.id"
             />
           </el-select>
         </el-form-item>
         <el-form-item label="上课教室" prop="bsloId">
           <el-select v-model="form.bsloId" filterable placeholder="请选择" style="width:100%">
             <el-option
                     v-for="item1 in classRoomList"
                     :key="item1.id"
                     :label="item1.locationName"
                     :value="item1.id"
             >
              <span style="float: left">{{ item1.locationName }}</span>
              <span style="float: right; color: #8492a6; font-size: 13px">{{ item1.levelName }}</span>
             </el-option>
           </el-select>
         </el-form-item>
        <el-form-item label="排课节次" prop="coseId">

          <el-select v-model="form.coseId" filterable placeholder="请选择" style="width:100%">
             <el-option
                     v-for="item1 in coseList"
                     :key="item1.id"
                     :label="item1.coseBeginTime+'~'+item1.coseEndTime"
                     :value="item1.id"
             >
              <span style="float: left">{{ item1.coseBeginTime+'~'+item1.coseEndTime }}</span>
              <span style="float: right; color: #8492a6; font-size: 13px">{{ '第'+item1.coseCode+'节课' }}</span>
             </el-option>
          </el-select>
        </el-form-item>
       <el-form-item label="课程星期数" prop="coplWeekDayNoList">
        <el-checkbox-group v-model="form.coplWeekDayNoList">
          <el-checkbox label="1">星期一</el-checkbox>
          <el-checkbox label="2">星期二</el-checkbox>
          <el-checkbox label="3">星期三</el-checkbox>
          <el-checkbox label="4">星期四</el-checkbox>
          <el-checkbox label="5">星期五</el-checkbox>
          <el-checkbox label="6">星期六</el-checkbox>
          <el-checkbox label="7">星期日</el-checkbox>
        </el-checkbox-group>
        <!-- <el-input-number v-model="form.coplWeekDayNo" :min="1" :max="100" style="width:80%" label="描述文字"></el-input-number> -->
       </el-form-item>
       <el-row>
          <el-col :span="12">
            <el-form-item label="当前学期总周次" >
              {{ termWeekNum }}
            </el-form-item>
          </el-col>
       </el-row>
       <el-row>
          <el-col :span="12">
            <el-form-item label="课程开始周" prop="coplBeginWeekNo">
              <el-input-number v-model="form.coplBeginWeekNo" :min="1" :max="termWeekNum" style="width:80%" label="描述文字"></el-input-number>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="课程结束周" prop="coplEndWeekNo">
              <el-input-number v-model="form.coplEndWeekNo" :min="1" :max="termWeekNum" style="width:80%" label="描述文字"></el-input-number>
            </el-form-item>
          </el-col>
       </el-row>
       <el-form-item label="单双周" >
          <el-radio v-model="form.coplIsDuboleWeek" label="d">单周</el-radio>
          <el-radio v-model="form.coplIsDuboleWeek" label="s">双周</el-radio>
          <el-radio v-model="form.coplIsDuboleWeek" label="">不区分</el-radio>
       </el-form-item>

       <el-form-item label="备注" >
          <el-input v-model="form.remarks"></el-input>
       </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer" v-if="!form.id">
        <el-button type="primary" @click="submitForm">确 定</el-button>
        <el-button @click="cancel">取 消</el-button>
      </div>
    </el-dialog>

    <el-dialog title="教师课表" :visible.sync="teacherClassTimeVisible" width="1200px">

      <cla-time-calendar ref="claTimeCalendar" :teacherId="rowData.syusId +''" :subjectList="subjectList"
          :userOptions="userOptions"
          :coseList = "coseList"
          :classRoomList="classRoomList" :readonly="true" can-cla-time-attend class="calendar" />
    </el-dialog>
    </div>
  </template>

  <script>
  import { findSchoolClassPageList, deleteSchoolClassInfo,} from "@/api/classManage/classInfo";
  import { pageList,createOrUpdate,deleteCorsePlan} from "@/api/course/coursePlan";
  import { sessionsList} from "@/api/baseData/sectiontimemanagement";

  import { getClassTeacherList } from "@/api/system/user";
  import { findBaseSubjectPageList} from "@/api/baseData/profession";
  import { listTermtime } from "@/api/system/termtime.js";
  import { originalData} from "@/api/studentInfo/infoMaintenance/index";
  import { findBaseSpaceLocationPageList} from "@/api/baseData/siteManagement";
  import claTimeCalendar from '@/views/course/timetable/claTimeCalendar'
  import {subjectList} from "@/api/educational/subject.js";
  import moment from 'moment'
import { shim } from "quill";

  export default {
    name: "coursePlan",
    components: {
        claTimeCalendar
    },
    data() {
      return {
        checkList:[],
        teacherClassTimeVisible:false,
        activeName:'first',
        // 遮罩层
        loading: true,
        // 选中数组
        rowList: [],
        // 非单个禁用
        single: true,
        // 非多个禁用
        multiple: true,
        // 总条数
        total: 0,
        stuCount: 0,
        // 字典表格数据
        classList: [],
        // 弹出层标题
        title: "",
        // 是否显示弹出层
        open: false,
        // 班主任
        userOptions: [],
        // 状态数据字典
        statusOptions: [],
        // 班级所属部门
        classDeptOptions: [],
        // 查询参数
        queryParams: {
          pageNum: 1,
          pageSize: 10,
          scclId: undefined,
          status: undefined,
          classDept:undefined,
          syusId:''
        },
        // 表单参数
        form: {
          coplWeekDayNoList: [],
          coplBeginWeekNo:1
        },
        // 表单校验
        rules: {
          tetiId: [
            { required: true, message: "学期不能为空", trigger: "blur" }
          ],
          subjId: [
            { required: true, message: "科目不能为空", trigger: "blur" }
          ],
          scclId: [
            { required: true, message: "班级不能为空", trigger: "blur" }
          ],
          syusId:[
            { required: true, message: "任课老师不能为空", trigger: "blur" }
          ],
          bsloId:[
            { required: true, message: "上课教室不能为空", trigger: "blur" }
          ],
          coseId:[
            { required: true, message: "排课节次不能为空", trigger: "blur" }
          ],
          coplBeginWeekNo:[
            { required: true, message: "课程开始周不能为空", trigger: "blur" }
          ],
          coplWeekDayNoList:[
            { required: true, message: "课程星期数不能为空", trigger: "blur" }
          ],
          coplEndWeekNo:[
            { required: true, message: "课程结束周不能为空", trigger: "blur" }
          ]
        },
        subjectList:[],
        termTimeList:[],
        classGradeList:[],
        studentList:[],
        studentTotal:[],
        studentParam:{
          pageSize:10,
          pageNum:1
        },
        studentLoading:false,
        studentDialogVisible:false,
        classRoomList:[],
        coursePlanList:[],
        coseList:[],
        classId:null,
        showTabS:false,
        tetiBeginDate:null,
        tetiEndDate:null,
        rowData:{},
        termWeekNum:0
      };
    },
    created() {
      this.getList()
      this.getLocationList()
      this.getClassList();
      this.getClassTeacherList();
      this.getSubjectList()
      this.getTermTimeList()
      this.getCoseList()
    },
    methods: {
      //获取学期的总周数
      getAemesterWeekNum(val){
        let item={}
        for(let i=0;i<this.termTimeList.length;i++){
          if(this.termTimeList[i].id==val)
          {
            item = this.termTimeList[i]
          }
        }
        const beginDate =  this.parseTime(item.tetiTermBeginDate,'{y}-{m}-{d}')
        const endDate = this.parseTime(item.tetiTermEndDate,'{y}-{m}-{d}')
        console.log(beginDate, endDate)
        var d1 = new Date(beginDate);
        var d2 = new Date(endDate);
        var dt1 = d1.getTime();
        var dt2 = d2.getTime();
        this.termWeekNum =  Math.ceil(Math.abs(dt2 - dt1) / 1000 / 60 / 60 / 24 / 7);
        this.form.coplEndWeekNo = undefined
        this.form.coplBeginWeekNo = undefined
      },
      getCoseName(val){
        for(let i=0;i<this.coseList.length;i++){
          if(this.coseList[i].id==val){
            return this.coseList[i].coseBeginTime +'~'+ this.coseList[i].coseEndTime
          }
        }
      },
      getTetiDate(val){
        let beginDate=null
        let endDate=null
        for(let i=0;i<this.termTimeList.length;i++){
          if(this.termTimeList[i].id==val){
            beginDate = this.parseTime(this.termTimeList[i].tetiTermBeginDate,'{y}-{m}-{d}')
            endDate = this.parseTime(this.termTimeList[i].tetiTermEndDate,'{y}-{m}-{d}')
          }
        }

        //算出学期开始日期那一周的周一和周日
        this.tetiBeginDate = moment(new Date(beginDate)).weekday(1).format('YYYY-MM-DD')

        if(moment(new Date(endDate)).weekday()==0){
          endDate = moment(new Date(endDate)).subtract(1,'days')
        }
        this.tetiEndDate = moment(new Date(endDate)).weekday(1).format('YYYY-MM-DD')

        this.handleQuery()

      },
      getWeek(dateString) {
            var date;
            if (!dateString) {
                date = new Date();
            } else {
                var dateArray = dateString.split("-");
                date = new Date(dateArray[0], parseInt(dateArray[1] - 1), dateArray[2]);
            }
            //var weeks = new Array("日", "一", "二", "三", "四", "五", "六");
            //return "星期" + weeks[date.getDay()];
            return date.getDay();
        },
      openTeacherClassTime(row){
        //打开老师课表
        this.teacherClassTimeVisible = true
        this.rowData = row
      },
      handleClick(tab, event) {
        //切换tab
        console.log(tab, event);
        console.log(tab.name)
        if(tab.name=='second'){
          this.classId = this.classList[0].id+''
          this.queryParams.scclId = this.classList[0].id
          this.queryParams.tetiId = this.termTimeList[0].id
          this.getTetiDate(this.queryParams.tetiId)
          this.showTabS = true
        }else{
          this.showTabS = false
          this.resetQuery()
        }
      },
      getCoseList(){
        sessionsList({pageSize:20,pageNum:1}).then(resp=>{
          if(resp.data.list){
            this.coseList = resp.data.list
            console.log(resp.data.list)
          }
        })
      },
      getTeacherName(id){
        //老师名称
        for(let i=0;i<this.userOptions.length;i++){
          if(this.userOptions[i].id==id){
            return this.userOptions[i].username
          }
        }
      },
      getClassName(id){
        //班级名称
        for(let i=0;i<this.classList.length;i++){
          if(this.classList[i].id==id){
            return this.classList[i].className
          }
        }
      },
      getSubjectName(id){
        //科目名称
        for(let i=0;i<this.subjectList.length;i++){
          if(this.subjectList[i].id==id){
            return this.subjectList[i].subjName
          }
        }
      },
      getTermTimeName(id){
        //学期名称
        for(let i=0;i<this.termTimeList.length;i++){
          if(this.termTimeList[i].id==id){
            let str=''
            if(this.termTimeList[i].tetiTerm==1){
              str = '第一学期'
            }
            if(this.termTimeList[i].tetiTerm==2){
              str = '第二学期'
            }
            return this.termTimeList[i].tetiBeginYear+'~'+this.termTimeList[i].tetiEndYear+'['+str+']'
          }
        }
      },
      getLocationName(id){
        //获取教室名称
        for(let i=0;i<this.classRoomList.length;i++){
          if(this.classRoomList[i].id==id){
            return this.classRoomList[i].levelName
          }
        }
      },
      getList(){
        if(this.showTabS){
          this.showTabS = false
          const _this = this
          setTimeout(function(){
            _this.showTabS=true
          },500)

        }else{
          this.loading = true
          console.log(this.queryParams)
          pageList(this.queryParams).then(resp=>{
            this.coursePlanList = resp.data.list
            this.total = resp.data.total;
            this.loading = false;
          })
        }

      },
      getLocationList(){
        findBaseSpaceLocationPageList({pageNum:1,pageSize:1000,locationType: 4}).then(resp=>{
          this.classRoomList = resp.data.list
        })
      },
      handleStudent(row){
        this.studentDialogVisible = true
        this.studentParam.classId = row.id
        this.getStudentList()
      },
      getStudentList() {
        this.studentLoading = true
        originalData(this.studentParam).then((res) => {
          console.log(res);
          this.studentList = res.data.list;
          this.studentTotal = res.data.total;
          this.studentLoading = false
        });
      },
      getDictLabel(list,value){
         for(let i=0;i<list.length;i++){
          if(list[i].dictValue==value){
            return list[i].dictLabel
          }
         }
      },
      getTermTimeList() {
        //查询学期
        this.loading = true;
        listTermtime({pageSize:100,pageNum:1,status:1}).then(response => {
            this.termTimeList = response.data.list;

          }
        );
      },
      getSubjectList(){
        //查询专柜
        subjectList({pageSize:100,pageNum:1,status:1}).then(response =>{
          this.subjectList = response.data.list
        })
      },
      /** 查询班级列表 */
      getClassList() {
        this.loading = true;
        findSchoolClassPageList({pageSize:200,pageNum:1,status:1,isGraduation:0}).then(response => {
            this.classList = response.data.list;
            this.total = response.data.total;
            this.loading = false;
          }
        );
      },
      getClassTeacherList(){
        getClassTeacherList().then(response => {
          this.userOptions = response.data;
        });
      },
      // 字典设备状态字典翻译
      statusFormat(row, column) {
        return this.selectDictLabel(this.statusOptions, row.status);
      },
      // 字典设备状态字典翻译
      classDeptFormat(row, column) {
        return this.selectDictLabel(this.classDeptOptions, row.classDept);
      },
      // 取消按钮
      cancel() {
        this.open = false;
        this.reset();
      },
      // 表单重置
      reset() {
        this.form = {
          id: undefined,
          className: undefined,
          classTeacherId: undefined,
          status: "1",
          classDept:undefined,
          coplWeekDayNoList: []
        };
        this.resetForm("form");
      },
      /** 搜索按钮操作 */
      handleQuery() {
        this.queryParams.pageNum = 1;
        this.getList();
      },
      /** 重置按钮操作 */
      resetQuery() {
        this.dateRange = [];
        this.queryParams={
          pageSize:10,
          pageNum:1,
          tetiId:'',
          subjId:'',
          syusId:'',
          scclId:''
        }
        this.resetForm("queryForm");
        this.getList();
      },
      /** 新增按钮操作 */
      handleAdd() {
        this.reset();
        this.open = true;
        this.title = "添加班级信息";
      },
      // 多选框选中数据
      handleSelectionChange(selection) {
        console.log(selection)
        this.rowList = selection

        this.single = selection.length!==1
        this.multiple = !selection.length
      },
      /** 修改按钮操作 */
      handleUpdate(row) {
        this.reset();
        this.open = true
        this.form = JSON.parse(JSON.stringify(row))
        this.form.classSubject = row.classSubject?Number(row.classSubject):null
        this.form.semester = row.semester?Number(row.semester):null
        // this.form.classTeacherId = Number(row.classTeacherId)
        // this.form.assistantTeacharId = Number(row.assistantTeacharId)
      },
      /** 提交按钮 */
      submitForm: function() {
        this.$refs["form"].validate(valid => {
          if (valid) {
            createOrUpdate(this.form).then(resp=>{
              this.msgSuccess("提交成功");
              this.open = false
              this.getList()
            })

          }
        });
      },
      /** 删除按钮操作 */
      handleDelete(row) {
        const ids = row.id || this.ids;
        this.$confirm('是否确认删除排课计划，删除后所排课程也会删除?', "警告", {
                  confirmButtonText: "确定",
                  cancelButtonText: "取消",
                  type: "warning"
                }).then(function() {
                  return deleteCorsePlan(row.id);
                }).then(() => {
                  this.getList();
                  this.msgSuccess("删除成功");
                }).catch(function() {});




      },

    }
  };
  </script>
